<template>
    <div class="edit-popup">
        <popup
            ref="popupRef"
            :title="popupTitle"
            :async="true"
            width="850px"
            @confirm="handleSubmit"
            @close="handleClose"
        >
     
       <el-descriptions :column="2" border>
            <el-descriptions-item label="客户">{{ info.name }}</el-descriptions-item>
            <el-descriptions-item label="客户订单号">{{ info.orderNo }}</el-descriptions-item>
            <el-descriptions-item label="下单时间">{{ info.create_time }}</el-descriptions-item>
            <el-descriptions-item label="交货时间"><el-tag>{{ info.de_time }}</el-tag></el-descriptions-item>
            <el-descriptions-item label="备注">{{ info.remark }}</el-descriptions-item>
            <el-descriptions-item label="收货人电话">{{ info.kehu_address.phone }}</el-descriptions-item>
            <el-descriptions-item label="收货人">{{ info.kehu_address.name }}</el-descriptions-item>
            <el-descriptions-item label="地址">{{ info.kehu_address.address }}</el-descriptions-item>
            <el-descriptions-item label="订单数量">{{ info.nums }}</el-descriptions-item>
        </el-descriptions>
            <el-form ref="formRef" :model="tabledata.lists" label-width="90px" :rules="formRules">
                <el-table :data="tabledata.lists" border >
                    <el-table-column label="交货时间" prop="de_time" show-overflow-tooltip />
                    <el-table-column label="商品名称" prop="name" show-overflow-tooltip />
                    <el-table-column label="规格" prop="guige" show-overflow-tooltip />
                    <el-table-column label="下单数量" prop="num" show-overflow-tooltip />
                    <el-table-column label="下料" prop="xialiao_num"  show-overflow-tooltip />
                    <el-table-column label="单位" prop="unit">
                        <template #default="{ row }">
                            <dict-value :options="dictData.unit" :value="row.unit" />
                        </template>
                    </el-table-column>
                    <el-table-column label="备注" prop="remark" show-overflow-tooltip />
                    <el-table-column label="发货数量" width="120" fixed="right">
                        <template #default="{ row }">
                            <el-input v-model="row.fanum"  />
                        </template>
                    </el-table-column>
                </el-table>
            </el-form>
        </popup>
    </div>
</template>

<script lang="ts" setup name="ordersDetailEdit">
import type { FormInstance } from 'element-plus'
import Popup from '@/components/popup/index.vue'
import { usePaging } from "@/hooks/usePaging";
import { apiOrdersDetailLists,apiOrdersDetailDetail } from '@/api/orders/orders_detail'
import { apiOrdersDetail } from '@/api/orders/orders'
import { apiFahuoAdd, apiFahuoEdit, apiFahuoDetail } from '@/api/fahuo/fahuo'
import { timeFormat } from '@/utils/util'
import type { PropType } from 'vue'
import useUserStore from "@/stores/modules/user";
import feedback from "@/utils/feedback";
const userStore = useUserStore();
defineProps({
    dictData: {
        type: Object as PropType<Record<string, any[]>>,
        default: () => ({})
    }
})
const emit = defineEmits(['success', 'close'])
const formRef = shallowRef<FormInstance>()
const popupRef = shallowRef<InstanceType<typeof Popup>>()
const mode = ref('add')

// 弹窗标题
const popupTitle = computed(() => {
    return mode.value == 'edit' ? '编辑发货单' : '创建发货单'
})

const orders=reactive({})
// 表单数据
const formData = reactive({
    id: '',
    order_id: '',
    name: '',
    guige: '',
    num: '',
    unit: '',
    price: '',
    wuliaoNo: '',
    tuzhi: '',
    de_time: '',
    remark: '',
    orderNo: '',
})
let tabledata = reactive({
    lists:[]
})

const info = reactive({
    name:'',
    orderNo:'',
    kehu_id:0,
    id:0,
    remark:'',
    nums:0,
    create_time:'',
    kehu_address:{},
    de_time:'',
    address_id:0,
})
// 表单验证
const formRules = reactive<any>({
    
})
const queryParams = reactive({
    order_id:0
})


// // 分页相关
// const { pager, getLists } = usePaging({
//     fetchFun: apiOrdersDetailLists,
//     params: queryParams,
// });
const getLists = async ()=>{
  
  let {lists}=await apiOrdersDetailLists(queryParams)
  
   for(let i=0; i< lists.length; i++){
        lists[i].fanum=lists[i].xialiao_num
   }
   tabledata.lists=lists

}

// 获取详情
const setFormData = async (row: Record<any, any>) => {
   
    let data:any = {}
    queryParams['order_id'] = row.id
    data = await apiOrdersDetail({ id: row.id })
    for (const key in data) {
     
      
        if (data[key] != null && data[key] != undefined) {
            //@ts-ignore
            info[key] = data[key]
        }
    }
    
    getLists()
 
}
// 提交按钮
const handleSubmit = async () => {
  //  await feedback.confirm("确定要发货吗？");
const fahuoData={
    kehu_id: info.kehu_id,
    address_id: info.address_id,
    order_id: info.id,
    remark: info.remark,
    douser: userStore.userInfo.name,
}
let detailArray:any=[];
tabledata.lists.map((item:any,idx)=>{
    detailArray.push({
        order_id:item.order_id,
        detail_id:item.id,
        num:item.fanum,
        douser:userStore.userInfo.name,
    })
})
console.log(info)
console.log(detailArray)


await apiFahuoAdd({
    data:fahuoData,
    detial:detailArray
})
popupRef.value?.close()
emit('success')
}

//打开弹窗
const open = (type = 'add') => {
    mode.value = type
    popupRef.value?.open()

}

// 关闭回调
const handleClose = () => {
    emit('close')
}


defineExpose({
    open,
    setFormData,
    getLists
})

</script>
